<!DOCTYPE html>
<html>

<head>
    <meta charset="utf-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <title>秒杀列表</title>
    <meta content="width=device-width,initial-scale=1.0,maximum-scale=1.0,user-scalable=0" name="viewport" />
    <meta content="yes" name="apple-mobile-web-app-capable" />
    <meta content="black" name="apple-mobile-web-app-status-bar-style" />
    <meta content="telephone=no" name="format-detection" />
    <!-- 引入核心样式 -->
    <link href="../../../src/weui/lib/weui.css" rel="stylesheet">
    <link href="http://appimg.yinsoso.com/css/jquery-weui.css" rel="stylesheet">
    <link href="http://appimg.yinsoso.com/css/style-min.css" rel="stylesheet">
    <link href="http://appimg.yinsoso.com/css/public.css" rel="stylesheet">
    <!--当前页面的css-->
    <link href="../../css/secKill.css" rel="stylesheet">
    <!-- 引入核心JS -->
    <!-- <script src="http://appimg.yinsoso.com/js/vue.min.js"></script> -->
    <script src="../../../src/vue/vue.js"></script>
    <script src="http://appimg.yinsoso.com/js/3.2.0-jquery.min.js"></script>
    <script src="http://appimg.yinsoso.com/js/jquery-weui.min.js"></script>
    <script src="http://appimg.yinsoso.com/js/index.min.js"></script>
    <script src="http://appimg.yinsoso.com/js/fastclick.min.js"></script>
    <!--当前页面的js-->
    <!--引入mock数据-->

    <script src="http://appimg.yinsoso.com/js/common.js" type="text/javascript" ></script>
    <style>
        .gray{
            background: #b7b7b7;
        }
    </style>

</head>

<body id="seckill">
    <div id="app">
        <div v-if="pageFalg">
            <section class="sec-topbar flex">
                <div class="col4" v-for="(item,index) in tabs" @click="tab(item)">
                    <div class="sec-topgroup" :class="{'topgroup-active':item.active}">
                        <div class="txt1">
                            <p>{{item.start_timeStr}}</p>
                        </div>
                        <div class="txt2">
                            <p>{{item.text}}</p>
                        </div>
                    </div>
                </div>
            </section>
            <div class="count-downtxt">
                <div class="count-txt">
                    <span>抢购中 先下单先得哦</span>
                </div>
                <div class="fr">
                    <span class="font-size-2">距本场结束</span>
                    <div class="count-time" v-html="coutdownTimeStr">
                    </div>
                    <!-- <div>{{coutdownTimeStr}}</div> -->
                </div>
            </div>
            <!--秒杀商品列表-->
            <div class="tabCon">
                <section class="sec-product" v-show="list.length>0">
                    <ul>
                        <li v-for="(item,index) in list" @click="jump(item)">
                            <div class="product-img fl">
                                <img :src="item.head_img" class="head-img">
                                <div class="tip-soldout" v-show="item.hideing">已抢完</div>
                            </div>
                            <div class="sec-listright fr">
                                <p>{{item.goods_name}}</p>
                                <div class="sec-listpriceleft">
                                    <div class="sec-price">
                                        <span>￥</span>{{item.price}}</div>
                                    <div class="sec-oldprice">￥{{item.original_price}}</div>
                                </div>
                                <div class="sec-listpriceright">
                                    <div class="sold soldout" v-show="item.hideing">已抢完</div>
                                    <div class="sold soldin" v-show="!item.hideing" v-bind:class="{gray:item.className}">{{item.btnText}}</div>
                                    <div class="progress">
                                        <span>已售{{item.percentage}}%</span>
                                        <div class="progress-slide">
                                            <div class="progress-color" v-bind:style="{width:item.percentage+'%'}"></div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </li>
                    </ul>
                </section>
            </div>
            <div class="bottom-msg" v-if="!hideing">
                <div class="bottom-msg-hr"></div>
                <span class="msg-text">我是有底线的</span>
            </div>
        </div>
        <div v-else>
            <div class="noSecKill">
                <img src="../../../images/zanwumiaosha@2x.png" alt="暂无秒杀">
            </div>
            <div class="noSecKill-txt">暂无秒杀</div>
        </div>

    </div>
    <script src="../js/seckill.js"></script>
</body>

</html>